<template>
  <el-form :inline="true" label-width="90px" class="mark-form">
    <el-form-item :label="'验收状态：'" :label-position="'left'" class="form-item">
      {{ frame.mQaResult || '待验收' }}
    </el-form-item>
    <el-form-item class="form-item" @keydown.native.stop>
      <el-input type="text" placeholder="批注" size="mini" v-model="remark" clearable />
    </el-form-item>
    <el-form-item class="form-item">
      <el-tooltip effect="dark" content="通过" placement="right-end">
        <el-button type="success" size="mini" @click="handleComments('通过')" icon="el-icon-check" circle />
      </el-tooltip>
    </el-form-item>
    <el-form-item class="form-item">
      <el-tooltip effect="dark" content="驳回" placement="right-end">
        <el-button type="danger" size="mini" @click="handleComments('驳回')" icon="el-icon-close" circle />
      </el-tooltip>
    </el-form-item>
    <el-form-item class="form-item">
      <el-tooltip effect="dark" content="挂起" placement="right-end">
        <el-button type="warning" size="mini" @click="handleComments('挂起')" icon="el-icon-sort-down" circle />
      </el-tooltip>
    </el-form-item>
  </el-form>
</template>

<script>
import { listResult, updateResult } from '@/api/mark/qaresult'

export default {
  name: 'RemarkForm',
  props: {
    frame: {
      type: Object,
      default: () => ({}),
    },
    index: {
      type: Number,
      required: true,
    },
  },

  data() {
    return {
      remark: '',
    }
  },

  watch: {
    frame(item) {
      this.remark = item.remark
    },
  },

  methods: {
    // 验收提交
    handleComments(status) {
      console.log(status)

      const data = { ...this.frame }
      const { remark, index } = this
      data.mQaResult = status
      data.remark = remark

      // let data = {
      //   taskId: this.fileList[this.currentIndex].taskId,
      //   fileId: this.fileList[this.currentIndex].fileId,
      //   markResultId: this.fileList[this.currentIndex].markResultId,
      //   markType: this.fileList[this.currentIndex].markType,
      //   mQaResultId: this.fileList[this.currentIndex].mQaResultId,
      //   mQaResult: this.fileList[this.currentIndex].mQaResult,
      //   createBy: this.fileList[this.currentIndex].createBy,
      //   createTime: this.fileList[this.currentIndex].createTime,
      //   updateBy: this.fileList[this.currentIndex].updateBy,
      //   updateTime: this.fileList[this.currentIndex].updateTime,
      //   remark: this.fileList[this.currentIndex].remark,
      // }
      updateResult(data).then((response) => {
        if (response.code === 200) {
          if (status == '') {
            this.msgSuccess('批注更新成功。')
          } else {
            this.msgSuccess('标注结果' + status + '，开始载入下一张。')
          }
          this.$emit('change', { data, index })
        } else {
          this.msgError(response.msg)
        }
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.mark-form {
  .form-item {
    margin-top: -5px;
    margin-bottom: -30px;
  }
}
</style>
>
